<template>
  <div class="tmpl">
    <div class="title">
      <h2>{{goodsDesc.name}}</h2>
    </div>
    <div class="img">
      <img :src="'http://api.cat-shop.penkuoer.com'+goodsDesc.coverImg" alt>
    </div>
    <div class="content">
      <p v-html="goodsDesc.descriptions"></p>
    </div>
  </div>
</template>

<style scoped>
.title {
  border-bottom: 1px solid rgba(92, 92, 92, 0.3);
}

.title h2 {
  font-size: 20px;
  font-weight: bold;
  color: #0094ff;
}

.title,
.content,
.img {
  padding: 5px;
}
.img {
  width: 100%;

  border-bottom: 1px solid red;
}
.img img {
  width: 100%;
}
</style>

<script>
import common from "../../tools/common.js";

export default {
  data() {
    return {
      goodsDesc: {}
    };
  },
  created() {
    this.getGoodsDescData();
  },
  methods: {
    getGoodsDescData() {
      //url
      const url =
        common.apihost + "api/v1/products/" + this.$route.query.goodsId;
      console.log(url);
      //send request
      this.$http.get(url).then(
        res => {
          this.goodsDesc = res.body;
        },
        err => {}
      );
    }
  }
};
</script>